<button class='btn'>点我增添一行</button>
<!-- 表格 -->
<table id="myTable">
    <!-- 表头 -->
    <thead>
        <tr>
            <th>序号</th>
            <th>姓名</th>
            <th>年龄</th>
            <th>删除</th>
        </tr>
    </thead>
    <!-- 表格内容 -->
    <tbody class='tbd'></tbody>
</table>
<script>
    // 获取
    let button = document.querySelector('.btn')
    let table = document.getElementById('myTable')
    let tbody = document.querySelector('.tbd')
    // 点击按钮增添行 监听
    button.addEventListener('click', function (e) {
        // 添加tr
        let tr = document.createElement("tr")
        tbody.appendChild(tr)
        // 添加td内容
        tr.innerHTML +=
            `
            <td>1</td>
            <td>Tom</td>
            <td>18</td>
            <td><button class="del">删除</button></td>
            `
        
        tr.addEventListener("click", function(e){
        
            if(e.target.nodeName.toLowerCase() == 'button'){
                tr.remove();
            }
        })

    })
</script>